<div class="span12" style="height:30px;">
</div>

<div class="span5 rounded" style="margin-top:40px; border: 1px solid #ccc;height:244px">

</div>

<div id="form_div" class="span6">
    <?php if ($pass_inc == "pass_inc") { ?>
        <div id="error" class="alert alert-error">
            <strong>Error </strong>
            incorrect Password  !
        </div>
    <?php } ?>
    <form method="POST" class="form-horizontal" id="frm_account" action="account/deactivate">
        <fieldset>

            <!-- Form Name -->
            <legend>Deactivate or delete my account</legend>

            <?php
            $deactivate = isset($action) && $action == 'D' ? 'checked="checked"' : "";
            $delete = isset($action) && $action == 'S' ? 'checked="checked"' : "";
            $reason = isset($reason) ? $reason : "";
            //$reason = isset($reason)  ? $reason : "";
            ?>
            <!-- Multiple radioes -->
            <div class="control-group">
                <label class="control-label" for="action">What do you want to do</label>
                <div class="controls">
                    <label class="radio" for="action-0">
                        <input <?php echo $deactivate; ?> type="radio" name="action" id="action-0" value="D">
                        Deactivate my account
                    </label>
                    <label class="radio" for="action-1">
                        <input <?php echo $delete; ?> type="radio" name="action" id="action-1" value="S">
                        Definitely delete my account
                    </label>
                </div>
            </div>

            <!-- Textarea -->
            <div class="control-group">
                <label class="control-label" for="reason">Reason for leaving (Required)</label>
                <div class="controls">                     
                    <textarea id="reason" name="reason" required=""><?php echo $reason; ?></textarea>
                </div>
            </div>

            <!-- Password input-->
            <div class="control-group">
                <label class="control-label" for="password">Password</label>
                <div class="controls">
                    <input id="password" name="password" type="password" placeholder="Password" class="input-large" required="">
                </div>
            </div>

            <!-- Button -->
            <div class="control-group" style='margin-left: 100px;'>
                <!--<button id="singlebutton" name="submitbutton" class="btn btn-danger">Ok</button>-->
                <button id="xdqf" onclick="return goConfirmation()" name="submitbutton" class="btn btn-danger">Deactivate or delete my account</button>
                <button id="singlebuxstton" onclick="return cancel()" name="cancelbutton" class="btn btn-primary">Cancel</button>
            </div>

        </fieldset>
    </form>

</div>

<div id="confirm_div" class="span6">
    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
    <br/>Do you really want to leave wfaces?
    <br/><br/><br/>
    <button style="margin-left: 150px;" id="confirm_button" onclick="return confirm()" name="confirmbutton" class="btn btn-danger">I Confirm</button>
</div>
<script>
                    var password = "";
                    var action = "";
                    var reason = "";
                    $("#confirm_div").hide();
                    function confirm() {
                        $("#password").val(password);
                        $("#action").val(action);
                        $("#reason").val(reason);
                        // $("#form_div").show();
                        $("#frm_account").submit();
                    }

                    function cancel() {
                        window.location = 'chat/index';
                        return false;
                    }

                    function goConfirmation() {
                        if ($.trim($("#password").val()) == "" || ($.trim($("#reason").val()) == "")) {
                            return true;
                        }
                        //alert("false");
                        $("#form_div").hide();
                        $("#confirm_div").show();

                        password = $("#password").val();
                        action = $("#action").val();
                        reason = $("#reason").val();

                        return false;
                    }
</script>